<template>
  <div>
    <h2>图书列表</h2>
    <ul>
      <li v-for="book in books" :key="book.id">
        {{ book.title }} - {{ book.author }}
        <button @click="borrowBook(book)">借阅</button>
      </li>
    </ul>
  </div>
</template>

<script>
import axios from 'axios';

export default {
  data() {
    return {
      books: []
    }
  },
  mounted() {
    this.fetchBooks();
  },
  methods: {
    async fetchBooks() {
      const response = await axios.get('/api/books');
      this.books = response.data;
    },
    async borrowBook(book) {
      // 实现借阅逻辑
    }
  }
}
</script>